// ==UserScript==
// @name         ins爬虫
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://www.instagram.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=instagram.com
// @grant GM_xmlhttpRequest
// @grant GM_download
// @grant        unsafeWindow
// @require      https://unpkg.com/axios@0
// @require      https://unpkg.com/vue@3
// @require      https://unpkg.com/vue-router@4
// @require      https://unpkg.com/js-sha1@0

// @require      http://localhost:3003/src/config/config.js
// @require      http://localhost:3003/src/components/common.js
// @require      http://localhost:3003/src/api/api.js
// @require      http://localhost:3003/src/store/store.js

// @require      http://localhost:3003/src/components/common/gmxhr/xhr-adapter.js
// @require      http://localhost:3003/src/components/common/list/list.js
// @require      http://localhost:3003/src/components/common/form/form.js
// @require      http://localhost:3003/src/components/common/runner/runner.js
// @require      http://localhost:3003/src/components/common/heartbeat/heartbeat.js
// @require      http://localhost:3003/src/components/common/message/message.js

// @require      http://localhost:3003/src/components/task/task.js
// @require      http://localhost:3003/src/components/proxy/proxy.js
// @require      http://localhost:3003/src/components/user/user.js
// @require      http://localhost:3003/src/components/config/config.js
// @require      http://localhost:3003/src/css/css.js
// @require      http://localhost:3003/src/app.js
// @require      http://localhost:3003/src/router/router.js
// ==/UserScript==
// 引入axios
// 引入vue
// 引入vue-router

(function() {
    'use strict';

    // Your code here...
    unsafeWindow.axios = axios
    // 使用适配器
    axios.defaults.adapter = xhrAdapter
    // axios 自定义超时时间
    axios.defaults.timeout = appConfig.axiosTimeOut;
    //unsafeWindow.gmxhr = gmxhr
    unsafeWindow.GM_xmlhttpRequest = GM_xmlhttpRequest
    unsafeWindow.GM_download = GM_download
    //GM_xmlhttpRequest({
    //    method: 'GET',
    //    url: `http://10.0.0.1:3003/src/components/task/task.js`,
    //    onload: response => { console.log(response); }
    //});

    let doGet=()=>{
        GM_xmlhttpRequest({
            method: 'GET',
            url: `http://e.7mo.org:3003/src/components/task/task.js`,
            onload: response => { console.log(response); }
        });
    }
    unsafeWindow.doGet = doGet
    unsafeWindow.apis = apis
    unsafeWindow.appConfig = appConfig
    unsafeWindow.axios = axios
    unsafeWindow.sha1 = sha1
    unsafeWindow.Vue = Vue
    unsafeWindow.VueRouter = VueRouter
    // addMain
    let appMain = document.createElement('div')
    unsafeWindow.appMain = appMain
    let appPos = {w:400,h:800}
    unsafeWindow.appPos = appPos
    appMain.onmousemove=(e)=>{if (e.offsetX < 5){ e.target.style.cursor='col-resize'} else {e.target.style.cursor='auto'}}
    // css
    appMain.setAttribute('id','app-main')
    appMain.style.setProperty('border','1px solid black')
    appMain.style.setProperty('width','500px')
    appMain.style.setProperty('min-height','800px')
    appMain.style.setProperty('position','absolute')
    appMain.style.setProperty('top','10px')
    appMain.style.setProperty('right','10px')
    appMain.style.setProperty('background','rgba(255, 255, 255, 0.8)')
    // drag
    appMain.onmousedown=(e)=>{
        let startX = e.clientX
        let offsetX = e.offsetX
        if(offsetX>5){return}
        let startWidth = appMain.clientWidth
        document.onmousemove = function(e){
            var endX = e.clientX
            var moveLen = (startX-endX)
            let newWidth = startWidth + moveLen
            appMain.style.setProperty('width',newWidth+'px')
        }
        document.onmouseup = function(evt){
            evt.stopPropagation()
            document.onmousemove = null
            document.onmouseup = null
            appMain.releaseCapture && appMain.releaseCapture()
        }
        appMain.setCapture && appMain.setCapture()
        return false
    }
    document.body.appendChild(appMain)

    // appMsg
    let appMsg = document.createElement('div')
    unsafeWindow.appMsg = appMsg
    appMsg.setAttribute('id','app-message')
    appMain.appendChild(appMsg)
    // appBody
    let appBody = document.createElement('div')
    unsafeWindow.appBody = appBody
    appBody.setAttribute('id','app-body')
    appMain.appendChild(appBody)


    // vue 开始
    //
    let cloneApis = JSON.parse(JSON.stringify(apis));
    //let api = typeof (GM_xmlhttpRequest) === 'undefined' ? build(cloneApis) : buildGm(cloneApis);
    let api = build(cloneApis);
    unsafeWindow.api = api;

    // 3. 创建路由实例并传递 `routes` 配置
    // 你可以在这里输入更多的配置，但我们在这里
    // 暂时保持简单
    const router = VueRouter.createRouter({
        // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
        history: VueRouter.createWebHashHistory(),
        routes, // `routes: routes` 的缩写
    });

    // 5. 创建并挂载根实例
    const app = Vue.createApp(App);

    /**
     * @see <a href="https://blog.csdn.net/qq_27694835/article/details/114243019">Vue3.0 挂载axios全局方法</a>
     * @type {(function(*=): *)|undefined}
     */
    app.config.globalProperties.$api = api;
    //确保 _use_ 路由实例使
    //整个应用支持路由。
    app.use(router);

    app.mount(appBody)


    // 消息组件 https://blog.csdn.net/hncu1990/article/details/119273475
    const {createApp, h} = Vue;
    const message = (props) => {
        const container = document.createElement("div");
        // 获取组件的DOM，将其挂载到body上
        const vm = createApp({
            render() {
                return h(Message, props);
            },
        });
        const appMessage = appMsg;
        appMessage.appendChild(vm.mount(container).$el);
        // @see <a href="https://v3.cn.vuejs.org/api/application-api.html#unmount">Vue3 unmount</a>
        let {duration = 3} = props;
        setTimeout(() => {
            vm.unmount();
        }, duration * 1000);
        return {
            close: () => (vm.component.proxy.isShow = false),
        };
    };
    app.config.globalProperties.$message = message;

})();